<template>
  <div class="contents">
   <!-- 报警配置 -->
    <el-form
        :model="settingRuleForm"
        :rules="settingRules"
        ref="settingRefRuleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="一级上限：" prop="firstCap">
          <el-input v-model="settingRuleForm.firstCap" placeholder="请输入一级上限"></el-input>
        </el-form-item>
        <el-form-item label="一级下限：" prop="firstFloor">
          <el-input v-model="settingRuleForm.firstFloor" placeholder="请输入一级下限"></el-input>
        </el-form-item>
        <el-form-item label="二级上限：" prop="secondCap">
          <el-input v-model="settingRuleForm.secondCap" placeholder="请输入二级上限"></el-input>
        </el-form-item>
        <el-form-item label="二级下限：" prop="secondFloor">
          <el-input v-model="settingRuleForm.secondFloor" placeholder="请输入二级下限"></el-input>
        </el-form-item>
        <el-form-item label="三级上限：" prop="thirdCap">
          <el-input v-model="settingRuleForm.thirdCap" placeholder="请输入三级上限"></el-input>
        </el-form-item>
        <el-form-item label="三级下限：" prop="thirdFloor">
          <el-input v-model="settingRuleForm.thirdFloor" placeholder="请输入三级下限"></el-input>
        </el-form-item>
      </el-form>
      <p class="btn">
        <el-button type="primary" size="small" @click="save">保存</el-button>
      </p>
  </div>
</template>

<script>
import { mapState, mapActions } from "vuex"
export default {
  props: {
    selectRow: {
      type: Object,
    },
  },
  data() {
    return {
      //   表单数据
      settingRuleForm: {
        firstCap:"",
        firstFloor:"",
        secondCap:"",
        secondFloor:"",
        thirdCap:"",
        thirdFloor:""
      },
      //   验证规则
      settingRules: {
        // firstCap: [{ required: true, message: "请输入一级上限", trigger: "blur" }],
        // firstFloor: [{ required: true, message: "请输入一级下限", trigger: "blur" }],
      },
    };
  },
  components: {
    
  },
  methods: {
    // 新增告警信息 setWarning
    save(){
      if(this.settingRuleForm.id){
        // xiugai
        this.$refs.settingRefRuleForm.validate((valid) => {
        if (!valid) return;
        let _params = {
          firstCap:this.settingRuleForm.firstCap,
          firstFloor:this.settingRuleForm.firstFloor,
          secondCap:this.settingRuleForm.secondCap,
          secondFloor:this.settingRuleForm.secondFloor,
          thirdCap:this.settingRuleForm.thirdCap,
          thirdFloor:this.settingRuleForm.thirdFloor,
          measurePointId:this.settingRuleForm.measurePointId,
          ownId:this.initBridgeId,
          id: this.settingRuleForm.id
        }
        
        this.$api.mearsuringPointSetting.updateWarning(_params).then((res)=>{
          console.log(res)
          if(res.data.success){
            this.$vs.notify({
                text: "修改成功",
                color: "success",
                icon: "success",
              });
          }
        })
      });

      }else{
        this.$refs.settingRefRuleForm.validate((valid) => {
        if (!valid) return;
        let _params = {
          ownId:this.initBridgeId,
          measurePointId: this.selectRow.id,
          ...this.settingRuleForm
        }
        this.$api.mearsuringPointSetting.setWarning(_params).then((res)=>{
          console.log(res)
          if(res.data.success){
            this.$vs.notify({
                text: "设置成功",
                color: "success",
                icon: "success",
              });
              this.selectWarning(this.selectRow.id)
          }
        })
      });
      }
    },
    // 查询报警信息
    selectWarning(id){
      this.$api.mearsuringPointSetting.getWarning({
        measurePointId: id
      }).then((res)=>{
        // console.log("测点查报警信息", res.data.data[0][0])
        if(res.data.data[0][0]){
          this.settingRuleForm = res.data.data[0][0]
        }else{
          this.settingRuleForm = {
            firstCap:"",
        firstFloor:"",
        secondCap:"",
        secondFloor:"",
        thirdCap:"",
        thirdFloor:""
          }
        }
      })
    }

  },
  computed: {
    ...mapState("mpsModule",{
      initBridgeId:"InitBridgeId",
    })
  },
  watch:{
    selectRow:{
      handler(newVal){
        // 查询报警信息
        this.selectWarning(newVal.id)
      },
      deep:true,
      immediate:true
    }
  }
};

</script>
<style lang="scss" scoped>
  .btn{
    text-align: right;
  }
</style>